<!DOCTYPE html>

<html xmlns:th="http://www.thymeleaf.org">

  <head>
    <title>Good Thymes Virtual Grocery</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" media="all" href="../../../css/gtvg.css" th:href="@{/css/gtvg.css}" />
  </head>

  <body>

    <h1>Product list</h1>
  
    <table>
      <thead>
        <tr>
          <th>NAME</th>
          <th>PRICE</th>
          <th>IN STOCK</th>
          <th>COMMENTS</th>
        </tr>
      </thead>
      <tbody th:remove="all-but-first">
        <tr th:each="prod : ${prods}" th:class="${prodStat.odd}? 'odd'">
          <td th:text="${prod.name}">Onions</td>
          <td th:text="${prod.price}">2.41</td>
          <td th:text="${prod.inStock}? #{true} : #{false}">yes</td>
          <td>
            <span th:text="${#lists.size(prod.comments)}">2</span> comment/s
            <a href="comments.html" 
               th:href="@{/product/comments(prodId=${prod.id})}" 
               th:unless="${#lists.isEmpty(prod.comments)}">view</a>
          </td>
        </tr>
        <tr class="odd">
          <td>Blue Lettuce</td>
          <td>9.55</td>
          <td>no</td>
          <td>
            <span>0</span> comment/s
          </td>
        </tr>
        <tr>
          <td>Mild Cinnamon</td>
          <td>1.99</td>
          <td>yes</td>
          <td>
            <span>3</span> comment/s
            <a href="comments.html">view</a>
          </td>
        </tr>
      </tbody>
    </table>
  
    <p>
      <a href="../home.html" th:href="@{/}">Return to home</a>
    </p>
    
  </body>
  
</html>

